<template>
	<view class="prod-box" :style="{ '--price': vuex_config.price }">
		<view v-show="prodIndex < 3 || item.show" class="no_img_main" v-for="(item, index) in orderInfo.detailed" :key="index">
			<!-- 酒店订单 -->
			<view class="no_l u-line-2">{{ item.product_name }}</view>
			<view class="no_r">
				<view class="sww-tp">
					<text class="u-font-26">￥</text>
					<text class="price_num">{{ item.price }}</text>
				</view>
				<view class="buy_num">x {{ item.num || 1 }}</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	components: {},
	data() {
		return {};
	},
	props: {
		orderInfo: {
			type: Object,
			default: () => {
				return {};
			}
		}
	},
	mounted() {},

	methods: {}
};
</script>

<style scoped lang="scss">
/* 商品信息 */
.prod-box {
	width: 100%;
}

.no_img_main {
	display: flex;
	padding: 20rpx 0;
	border-bottom: 1px solid #f5f5f5;
	.no_l {
		flex: 1;
		overflow: hidden;
		line-height: 40rpx;
		font-size: 26rpx;
		height: 80rpx;
	}
	.no_r {
		margin-left: 40rpx;
		text-align: right;
		.price_num {
			font-weight: bold;
			font-size: 30rpx;
		}
		.buy_num {
			color: #999;
			font-size: 30rpx;
		}
	}
}
</style>
